<template>
  <div class="hello">
    <h1>当前求和为:{{ sum }}</h1>
    <h2>乘以10之后就是:{{bigSum}}</h2>
    <button @click="add">+</button>
    <button @click='addWait'>延迟+</button>
    <button @click="reduce">-</button>
  </div>
</template>

<script>
export default {
  name: 'P111',
  data(){
    return {
    }
  },
  computed:{
    sum(){
      return this.$store.state.sum
    },
    bigSum(){
      return this.$store.getters.bigSum
    }
  },
  methods:{
    add(){
      // 当操作不涉及异步请求或者复杂业务逻辑的时候，可以直接commit，也就是直接访问mutations
      // this.$store.dispatch('add',1)
      this.$store.commit('ADD',1)
    },
    addWait(){
      this.$store.dispatch('addWait',1)
    },
    reduce(){
      this.$store.commit('REDUCE',1)
    }
  }
}
</script>

